import React, { useState, useEffect } from 'react';
import { Form, Button, Space, notification } from 'antd';
import { goBack, componentsMap } from '@/utils/util';
import UploadList from '@/components/UploadList';
import './index.less';
import API from '@/api/cyindex.js';

const safe_edit = ({ history }) => {
  const [receiverList] = useState([]);
  const [AQSJTB_SJLX, setAQSJTB_SJLX] = useState([]);
  const [SJLY, setSJLY] = useState([]);
  const [JJCD, setJJCD] = useState([]);
  const [form] = Form.useForm();
  const [fileList, setFileList] = useState([]);
  const [cflge, setCflge] = useState(null);
  const TableList = [
    {
      label: '通报函号',
      name: 'reportId',
      type: 'input',
      otherProps: {
        disabled: true,
      },
    },
    {
      label: '事件来源',
      name: 'eventSource',
      type: 'select',
      otherProps: {
        options: SJLY,
      },
      rules: [
        {
          required: true,
          message: '请选择事件来源',
        },
      ],
    },
    {
      label: '事件类型',
      name: 'eventType',
      type: 'select',
      otherProps: {
        options: AQSJTB_SJLX,
      },
      rules: [
        {
          required: true,
          message: '请选择事件类型',
        },
      ],
    },
    {
      label: '紧急程度',
      name: 'emergency',
      type: 'select',
      otherProps: {
        options: JJCD,
      },
      rules: [
        {
          required: true,
          message: '请选择事件紧急程度',
        },
      ],
    },
    {
      label: '接收单位',
      name: 'receiverName',
      type: 'select',
      otherProps: {
        options: receiverList,
        disabled: true,
      },
      isremark: true,
    },
    {
      label: '备注说明',
      name: 'adress',
      type: 'textarea',
      isremark: true,
    },
  ];
  const uploadOptions = {
    fileTypes: [
      'application/doc',
      'application/pdf',
      'application/msword',
      'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
      'image/jpg',
      'image/jpeg',
      'image/png',
    ],
    maxSize: 50,
    maxNum: 3,
    accept: [
      '.doc,.docx.,.pdf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,.jpg,.jpeg,.png',
    ],
    acceptMessage: 'jpg/word/pdf',
  };
  const submitFn = (values) => {
    const xx = JSON.parse(history.location.query.r);
    values.flge = cflge;
    values.id = xx.id;
    values.receiverId = xx.rId;
    const aa = [];
    values.snfileList.map((item) => {
      aa.push({
        fileName: item.fileName,
        originalFileName: item.originalFileName,
      });
    });
    values.snfileList = aa;
    API.updateNotification(values).then((res) => {
      if (res) {
        notification.success({
          message: '修改成功',
        });
        goBack();
      }
    });
  };
  function baocun(r) {
    setCflge(r);
  }
  const initList = () => {
    API.dictItemList()
      .then((res) => {
        const JJCDList = [];
        const SJLYList = [];
        const AQSJTB_SJLXList = [];
        if (res) {
          res.t.map((item) => {
            if (item.dictCode == 'JJCD') {
              JJCDList.push({
                label: item.dictItemName,
                value: item.dictItemType,
              });
            }
            if (item.dictCode == 'SJLY') {
              SJLYList.push({
                label: item.dictItemName,
                value: item.dictItemType,
              });
            }
            if (item.dictCode == 'AQSJTB_SJLX') {
              AQSJTB_SJLXList.push({
                label: item.dictItemName,
                value: item.dictItemType,
              });
            }
          });
          setJJCD(JJCDList);
          setSJLY(SJLYList);
          setAQSJTB_SJLX(AQSJTB_SJLXList);
        }
      })
      .then(() => {
        const xx = JSON.parse(history.location.query.r);
        API.showJjt({ id: xx.id, receverId: xx.rId }).then((res) => {
          if (res) {
            form.setFieldsValue(res.t);
            setFileList(res.t.snfileList);
          }
        });
      });
  };
  useEffect(() => {
    initList();
  }, []);
  return (
    <div className="main-x">
      <Form form={form} onFinish={submitFn}>
        <div className="base-title">安全事件信息</div>
        <div className="ant-form-inline form-x bgf">
          {TableList.map((item) => {
            return (
              <Form.Item
                key={item.name}
                label={item.label}
                name={item.name}
                className={item.isremark ? 'block' : ''}
                rules={item.rules}
              >
                {componentsMap(item.type, item.otherProps)}
              </Form.Item>
            );
          })}
        </div>
        <div className="base-title mt20">附件信息</div>
        <div className="form-x bgf" style={{ paddingBottom: '16px' }}>
          <Form.Item
            label="附件信息"
            extra="支持jpg/word/pdf格式,单个大小在50M以内,支持多个上传，最多上传3个附件"
            name="snfileList"
            className="block"
            rules={[{ required: true, message: '请上传文件' }]}
          >
            <UploadList
              uploadUrl="/notification/dispose/fileUpload"
              downloadUrl="/notification/dispose/download"
              options={uploadOptions}
              defaultFiles={fileList}
            ></UploadList>
          </Form.Item>
        </div>
        <div className="footer-x">
          <Space className="btns" size={18}>
            <Button
              type="primary"
              htmlType="submit"
              onClick={baocun.bind(null, 1)}
            >
              保存
            </Button>
            <Button
              type="primary"
              htmlType="submit"
              onClick={baocun.bind(null, 2)}
            >
              提交
            </Button>
            <Button type="primary" className="cancel-btn" onClick={goBack}>
              返回
            </Button>
          </Space>
        </div>
      </Form>
    </div>
  );
};

export default safe_edit;
